<?php
session_start();
?>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>会员管理系统</title>
    <style>
        .main {
            width: 80%;
            margin: 0 auto;
            text-align: center;
            /* background: green; */
        }

        .red {
            color: red;
        }

        .none {
            display: none;
        }
    </style>
</head>
<body>
<div class="main">
    <?php
    include_once 'nav.php';
    include_once 'conn.php';
    $sql = "select username,email,sex,fav from user where username='" . $_SESSION['loggedUserName'] . "';";
    $result = mysqli_query($conn, $sql);
    if(!mysqli_num_rows($result)) {
        echo "<script>alert('');</script>";
        exit;
    }
    $info = mysqli_fetch_array($result);
    $favs = explode(',',$info['fav']);
    ?>

    <form action="postModify.php" method="post" onsubmit="return check()">
        <table align="center" border="1" style="border-collapse: collapse" cellpadding="10">
            <tr>
                <td>用户名</td>
                <td><input type="text" name="userName" readonly value="<?php echo $info['username'] ?>"><span class="red none">*</span></td>
            </tr>
            <tr>
                <td>密码</td>
                <td><input type="password" name="pwd" placeholder="不修改密码请留空"></td>
            </tr>
            <tr>
                <td>确认密码</td>
                <td><input type="password" name="cpwd" placeholder="不修改密码请留空"></td>
            </tr>
            <tr>
                <td>性别</td>
                <td>
                    <input type="radio" name="sex" <?php echo $info['sex']?'checked':''; ?> value="1" id="nan"><label for="nan">男</label>
                    <input type="radio" name="sex" <?php echo !$info['sex']?'checked':''; ?> value="0" id="nv"><label for="nv">女</label>
                </td>
            </tr>
            <tr>
                <td>爱好</td>
                <td>
                    <input type="checkbox" name="fav[]" value="听音乐" id="music"  <?php if(in_array("听音乐",$favs)) echo 'checked'; ?> ><label for="music">听音乐</label>
                    <input type="checkbox" name="fav[]" value="玩游戏" id="game"  <?php if(in_array("玩游戏",$favs)) echo 'checked'; ?> ><label for="game">玩游戏</label>
                    <input type="checkbox" name="fav[]" value="踢足球" id="football"  <?php if(in_array("踢足球",$favs)) echo 'checked'; ?> ><label for="football">踢足球</label>
                </td>
            </tr>
            <tr>
                <td>邮箱</td>
                <td><label><input type="email" value="<?php echo $info['email'] ?>" name="email"></label></td>
            </tr>
            <tr>
                <td>

                </td>
                <td>
                    <input type="submit" value="提交">
                    <input type="reset" value="重置">
                </td>
            </tr>
        </table>
    </form>
</div>

<script>
    function check() {
        let pwd = document.getElementsByName('pwd')[0].value.trim();
        let cpwd = document.getElementsByName('cpwd')[0].value.trim();
        let email = document.getElementsByName('email')[0].value.trim();

        // 密码验证
        if(pwd.length>0){
            let pwdReg = /^[a-zA-Z0-9_*]{6,10}$/;
            if (!pwdReg.test(pwd)) {
                alert("密码必填,且只能大小写和数字,以及*_构成,长度为6到10个字符!");
                return false;
            } else if (pwd !== cpwd) {
                alert("密码和确认密码必须相同!");
                return false;
            }
        }

        // 邮箱识别
        let emailReg = /^[a-zA-Z0-9_\-]+@[a-zA-Z0-9]+\.(com|cn|net|org)$/;
        if (email.length > 0 && !emailReg.test(email)) {
            alert("信箱格式不正确!");
            return false;
        }

        return true;
    }
</script>
</body>
</html>